import React, { Component, useState } from 'react';
import { connect } from 'react-redux';
import { Button, Modal, Form, Input, Radio, Select } from 'antd';
import action from '../../../store/action';
import Transfer from '../Transfer';
import Store from "../../../store";
const CollectionCreateForm = ({ visible, onCreate, onCancel }) => {
    const [form] = Form.useForm();
    const { Option } = Select;
    const [state, setState] = useState(false);
    const handel_show = (e) => {
        e == 3 ? setState(!state) : setState(false);
    }
    const { TextArea } = Input;
    return (
        <Modal
            visible={visible}
            title="添加单位信息"
            okText="提交"
            cancelText="取消"
            onCancel={onCancel}
            onOk={() => {
                form
                    .validateFields()
                    .then(values => {
                        form.resetFields();
                        onCreate(values);
                        setState(false)
                    })
                    .catch(info => {
                        console.log('Validate Failed:', info);
                    });
            }}
        >
            <div style={{ margin: '0 auto', width: 200, fontSize: 20 }}>
                默认密码为: <a>123456</a>
            </div>
            <Form
                form={form}
                layout="vertical"
                name="form_in_modal"
                initialValues={{
                    modifier: 'public',
                }}
            >
                <div className="add_flex">
                    <Form.Item
                        name="usertype"
                        label="类型:"
                        rules={[
                            {
                                required: true,
                                message: '内容不能为空!',
                            },
                        ]}
                    >
                        <Select placeholder="选择创建用户类型" onChange={(e) => handel_show(e)}>
                            <Option value='1'>管理用户</Option>
                            <Option value="3">普通用户</Option>
                        </Select>
                    </Form.Item>

                    <Form.Item
                        name="lname"
                        label="用户名:"
                        rules={[
                            {
                                required: true,
                                message: '内容不能为空!',
                            },
                        ]}
                    >
                        <Input placeholder='请输入用户名' />
                    </Form.Item>
                </div>
                <div className='add_flex'>
                    <Form.Item name="name" label="姓名:" rules={[
                        {
                            required: true,
                            message: '内容不能为空!',
                        },
                    ]}>
                        <Input type="textarea" placeholder='请输入姓名' />
                    </Form.Item>
                    <Form.Item name="professionalDirection" label="专业方向:" rules={[
                        {
                            required: true,
                            message: '内容不能为空!',
                        },
                    ]}>
                        <Input type="textarea" placeholder='请输入专业放向' />
                    </Form.Item>
                </div>
                <div className='add_flex'>
                    <Form.Item name="sex" label="性别:" rules={[
                        {
                            required: true,
                            message: '性别必选!',
                        },
                    ]}>
                        <Radio.Group>
                            <Radio value='1'>男</Radio>
                            <Radio value='2'>女</Radio>

                        </Radio.Group>
                    </Form.Item>
                    <Form.Item name="titleOfTechnicalPost" label="职称:" rules={[
                        {
                            required: true,
                            message: '内容不能为空!',
                        },
                    ]}>
                        <Input type="textarea" placeholder='请输入职业' />
                    </Form.Item>
                </div>
                <div className='add_flex'>
                    <Form.Item name="mail" label="邮箱:" rules={[
                        {
                            required: true,
                            message: '内容不能为空!',
                        },
                    ]}>
                        <Input type="textarea" placeholder='请输入邮箱地址' />
                    </Form.Item>
                    <Form.Item name="remark" label="简介:">
                        <TextArea allowClear autoSize={true} />
                    </Form.Item>

                </div>
                <div className='add_flex'>
                    {
                        state === true ? <Transfer /> : null
                    }
                    <div></div>
                </div>

            </Form>
        </Modal>
    );
};

const CollectionsPage = (props) => {
    const [visible, setVisible] = useState(false);

    const onCreate = values => {
        setVisible(false);
        props.item(values)
    };
    return (
        <div style={{ marginBottom: 10 }}>
            <Button
                type="primary"
                onClick={() => {
                    setVisible(true);
                }}
                style={{ width: '100px' }}
            >
                添加
      </Button>
            <CollectionCreateForm
                visible={visible}
                onCreate={onCreate}

                onCancel={() => {
                    setVisible(false);
                }}
            />
        </div>
    );
};

class index extends React.Component {
    constructor() {
        super();
    }
    render() {
        return <CollectionsPage item={(val) => this.handel_add(val)} />
    }
    handel_add = (e) => {
        const code = sessionStorage.getItem('admin_key');

        let newList;
        if (e.usertype == '3') {
            newList = e.transfer.map((item, index) => {
                let trans_list = {};
                let user_propsVal = {};
                user_propsVal.useCode = '0'
                user_propsVal.type = 2
                user_propsVal.targetId = this.props.manageAdd_val[item].code

                return Object.assign(trans_list, user_propsVal)
            })
        }
        let list = {
            lname: e.lname,
            usertype: e.usertype,
            name: e.name,
            professionalDirection: e.professionalDirection,
            sex: e.sex,
            titleOfTechnicalPost: e.titleOfTechnicalPost,
            mail: e.mail,
            remark: e.remark,
        }
        let userList = {
            user: list,
            userOrganizationAndUserPermissionsList: newList
        }
        this.$axios.get('/manager/api/isOrganizationNameExist', this.$qs.stringify({ name: e.title })).then((res) => {
            if (res) {
                this.$axios.post(`/manager/api/addUser?lUserCode=${code}`, userList).then((res) => {

                    if (res.status === 1) {
                        this.$axios.get(`/manager/api/pageGetUserList/0/9999?lUserCode=${code}`).then((res) => {
                            const { management_get } = this.props;
                            let list = {};
                            [].push.apply(list, res.userList);
                            management_get(list);
                        }).catch((err) => {
                            console.log(err);
                        })
                    }
                }).catch((err) => {
                    console.log(err);
                })
            }
        }).catch((err) => {
            console.log(err);

        })
    }

}

export default connect(state => ({ ...state.custom }), action.custom)(index);